<%--
  Created by IntelliJ IDEA.
  User: 22531
  Date: 2021/5/31
  Time: 20:09
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css">
    <script type="text/javascript" src="/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/js/jquery.edatagrid.js"></script>
    <script src="/easyui/locale/easyui-lang-zh_CN.js"></script>
</head>
<body>

<div class="easyui-panel" data-options="fit:true,border:false">
    <table id="allStuInfo"></table>
</div>

<script type="text/javascript">
    $(function () {
        $('#allStuInfo').edatagrid({
            url: '/admin/QueryAllStuInfo',
            updateUrl: '/admin/adUpStu',
            destroyUrl: '/admin/adDelStu',
            columns:[[
                {field:"id",align:"center",title:'学生ID'},
                {field:"sno",align:"center",title:'学号',editor:{type:'textbox',options:{required:true}}},
                {field:"name",align:"center" ,title:'姓名',editor:{type:'textbox',options:{required:true}}},
                {field:"password", align:"center",title:"密码",editor:{type:'textbox',options:{required:true}}},
                {field:"clazzName" ,width:100,align:"center",title:"班级",editor:{type:'combobox',
                        options: {
                            valueField:'name',
                            textField:'name',
                            method:'get',
                            url:'/admin/getAllClazz',
                            required:true,
                            editable:false,
                        }
                    }},
                {field:"dept", align:"center",title:'学院'},
                {field:"sex", align:"center",title:'性别',editor:{type:'combobox',
                        options:{
                            valueField: 'label',
                            textField: 'value',
                            data: [{
                                label: '男',
                                value: '男'
                            },{
                                label: '女',
                                value: '女'
                            }],
                            required:true,
                            editable:false,
                        }
                    }},
                {field:"address" ,width:100,align:"center",title:'地址',editor:{type:'textbox',options:{required:true}}},
                {field:"age", align:"center",title:'年龄',editor:{type:'numberbox',options:{required:true}}},
                {field:"phone" ,align:"center",title:'电话',editor:{type:'textbox',options:{required:true}}},
                {field:"dormitory", align:"center",title:'宿舍',editor:{type:'textbox',options:{required:true}}},
                {field:"native_place" ,align:"center",title:'籍贯',editor:{type:'textbox',options:{required:true}}}
            ]],
            iconCls: 'icon-edit',
            title:'增删改学生信息',
            singleSelect: true,
            method: 'get',
            rownumbers:true,
            pagination: true,
            pageSize:10,
            pageList:[10,20,30,40,50],
            idField:'id',
            toolbar: '#allStuInfoTb',
            onSuccess:function (index,row){
                if(row.msg){
                    $.messager.alert('操作结果','操作成功!','info');
                    $('#allStuInfo').edatagrid('reload');
                }
                else {
                    $.messager.alert('操作结果','操作失败!'+row.error,'warning');
                    $('#allStuInfo').edatagrid('reload');
                }
            },
            onError:function (index,row){
                $.messager.alert('操作结果','服务器错误!','warning');
                $('#allStuInfo').edatagrid('reload');
            }
        })
    })
</script>


<div id="allStuInfoTb" style="height:auto;padding:3px">
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-reload',plain:true" onclick="myReload()">刷新</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="del()">删除学生</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" onclick="save()">保存修改</a>
    <span>通过|姓名|学号|班级名称|查询</span>
    <input id="str" style="line-height:26px;border:1px solid #ccc">
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true" style="color: #8e44ad" onclick="doSearch()">Search</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-reload',plain:true" style="color: #8e44ad" onclick="loadAll()">加载所有学生</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-undo',plain:true" onclick="undo()">取消</a>

</div>
<script type="text/javascript">
    function myReload(){
        $('#allStuInfo').edatagrid('reload');
    }

    function del(){
        $('#allStuInfo').edatagrid('destroyRow');
    }

    function save() {
        $('#allStuInfo').edatagrid('saveRow');
    }

    function undo() {
        $('#allStuInfo').edatagrid('cancelRow');
    }
    function doSearch(){
        if($('#str').val()==''){
            alert('请输入查询内容');
        }else {
            $('#allStuInfo').edatagrid('load',{
                str: $('#str').val(),
                st: '233',
            });
        }
    }

    function loadAll(){
        $('#allStuInfo').edatagrid('load',{
            str: $('#str').val(),
            st: 'null',
        });
    }
</script>

</body>
</html>
